<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="css/main.css">
    <link rel="stylesheet" href="css/weui.min.css">
    <title>微现场-摇一摇</title>
</head>
<body>
    <div class="main shake">
        <div class="msg">游戏1未开始</br>屏住呼吸，做好准备~</div>
        <div class="img"><img src="img/iphone11.png"></div>
        <a href="index.html">返回首页</a>
    </div>
    <audio id="run" src="img/shake_sound_male.mp3"></audio>
    <script src="js/jquery-1.8.0.min.js"></script>
    <script src="js/shake.js"></script>
    <script type="text/javascript" src="js/jweixin-1.2.0.js"></script>  
    <script src="js/moblie.helper.750.js"></script>
    <script src="js/weui.min.js"></script>
    <script>
    var shake = new Shake({
                threshold: 10, // 摇动阈值
                timeout: 500 // 事件发生频率，是可选值
            }),
            fore = document.getElementById('fore'),
            up = document.getElementById('up'),
            down = document.getElementById('down'),times = 0,shakeBgColor=['#10aeff','#549ec4','#648190','#204355','#0e86c4'];
    shake.start();
    // 数组去随机元素
    function randomOne(arr) {
        return arr[Math.floor(Math.random() * arr.length)];
    }
	window.addEventListener('shake', shakeEventDidOccur, false);
    $('.shake .img').click(function(){
        shakeEventDidOccur()    
    })
    function shakeEventDidOccur() {
    	times+=1
        $(".shake").css('background',randomOne(shakeBgColor))
    }
    </script>
</body>
</html>